<template>
  <div>
  <div class="title">
    <h2>实验室借用申请表</h2>
  </div>
  <div>
    <div class="title2" style="width:95%;margin:0 auto">
      <el-form
      :model="Info"
      ref="Info"
      label-width="180px">
      <el-form-item label="实验室编号：" prop="laboratory_id" style="padding-left:50px">
        <el-input v-model="Info.laboratory_id" placeholder="请输入实验室编号" style="width:85%;margin:0 auto;">
        </el-input>
      </el-form-item>
 <el-form-item label="实验室课程名称：" prop="course_name" style="padding-left:50px">
        <el-input v-model="Info.course_name" placeholder="请输入实验室课程名称" style="width:85%;margin:0 auto;">
        </el-input>
      </el-form-item>
 <el-form-item label="学生班级编号" prop="class_id" style="padding-left:50px">
        <el-input v-model="Info.class_id" placeholder="请输入学生班级及人数" style="width:85%;margin:0 auto;">
        </el-input>
      </el-form-item>
<el-form-item label="人数" prop="number" style="padding-left:50px">
        <el-input v-model="Info.number" placeholder="请输入学生班级及人数" style="width:85%;margin:0 auto;">
        </el-input>
      </el-form-item>
<el-form-item label="实验目的：" prop="purpose" style="padding-left:50px">
        <el-input v-model="Info.purpose" placeholder="请输入实验目的" style="width:85%;margin:0 auto;">
        </el-input>
      </el-form-item>
<el-form-item  label="开始使用日期" prop="start_time" style="padding-left:50px">
            <el-input v-model="Info.start_time" placeholder="10月10日输入样例：1010" style="width:85%;margin:0 auto;">
            </el-input>
      </el-form-item>
      <el-form-item  label="结束使用日期" prop="end_time" style="padding-left:50px">
           <el-input v-model="Info.end_time" placeholder="10月10日,输入样例：1010" style="width:85%;margin:0 auto;">
           </el-input>
      </el-form-item>
       <el-form-item  label="开始具体使用时间" prop="start_class" style="padding-left:50px">
    <el-time-picker
    arrow-control
    v-model="Info.start_class"
    style="padding:3px;margin:0 auto"
    placeholder="请选择时间：">
  </el-time-picker>
      </el-form-item>
  <el-form-item  label="结束具体使用时间" prop="end_class" style="padding-left:50px">
    <el-time-picker
    arrow-control
    v-model="Info.end_class"
    style="padding:3px;margin:0 auto"
    placeholder="请选择时间：">
  </el-time-picker>
      </el-form-item>
     <el-form-item label="电话：" prop="phone" style="padding-left:50px">
        <el-input v-model="Info.phone" placeholder="请输入电话" style="width:85%;margin:0 auto;">
        </el-input>
      </el-form-item>
      <el-form-item label="指导老师（申请人承诺）：" style="padding-left:50px">
<el-input type="textarea" :rows="3" placeholder="请输入指导老师（申请人承诺）" v-model="textarea" style="width:85%;margin:0 auto;">
</el-input>
      </el-form-item>
      <el-form-item prop="applicant_name" label="指导老师（申请人）签字：" style="padding-left:50px">
        <el-input v-model="Info.applicant_name" placeholder="请输入指导老师（申请人）签字" style="width:85%;margin:0 auto;">
        </el-input>
      </el-form-item>
      </el-form>
    </div>
</div>
<div>
    <el-button @click="submitsuccess()" type="primary" style="display:block;margin:0 auto">
      提 交 信 息
      </el-button>
</div>
  </div>
</template>

<script>
export default {
  data(){
    return {
      Info: {
      laboratory_id:'',
      course_name:'',
      class_id:'',
      number:'',
      purpose:'',
      start_time:'',
      end_time:'',
      start_class:'',
      end_class:'',
      phone:'',
      applicant_name:''
      },
      textarea:'',
    }
  },
      methods: {
        async submitsuccess(){
          console.log(this.Info);
          // console.log(this.Info.applicant_name);
        const {data: res}=await this.$http.post(
          '/api/student/labborrow?',this.Info)
          sessionStorage.setItem('formid',res.data.form_id)
          sessionStorage.setItem('applicantname',this.Info.applicant_name)
          const form_id=sessionStorage.getItem('formid')
          const applicant_name=sessionStorage.getItem('applicantname')
          // console.log(res)
          // console.log(applicant_name)
          if(res.code==200){
          this.$message.success("申请提交成功！")
          //  console.log(form_id)
           console.log(applicant_name)
            this.dialogVisible=false
        // console.log(form_id);
        // console.log(applicant_name);
            const type_id=1
        // console.log(type_id);
            const {data: re}=await this.$http.post(
          '/api/student/createform',{form_id:form_id,applicant_name:applicant_name,type_id:type_id}
          // form_id=this.form_id&applicant_name=this.applicant_name&type_id=this.type_id
        );
            // console.log(form_id)
            // console.log(applicant_name)
            // console.log(type_id)
            console.log(re)
          }else if(res.code==100){
            this.$message.error("申请提交失败！请重新填写！")
          }
            // this.$router.go(0)
      },
      },
    }
</script>

<style>
.title {
  text-align: center;
}
.title2 {
  text-align: left;
  padding-left: 20px;
  padding-right: 20px;
}
</style>